import React from 'react';

import styles from './UserBody.css';
import {Link} from "react-router-dom";
import UserService from "../../business/user/UserService";
import {message} from "antd";
import {UserInfoDomain} from "../../business/user/UserInfoDomain";


const userPage={
  "index":{
    pathname:"/point-shopping/user",
    state:{
      "bodyName":"index"
    }
  },
  "point":{
    pathname:"/point-shopping/user",
    state:{
      "bodyName":"point"
    }
  },
  "gift":{
    pathname:"/point-shopping/user",
    state:{
      "bodyName":"gift"
    }
  },
  "message":{
    pathname:"/point-shopping/user",
    state:{
      "bodyName":"message"
    }
  },
  "userLoophole":{
    pathname:"/point-shopping/user",
    state:{
      "bodyName":"userLoophole"
    }
  }
};
class UserBody extends React.Component{


  constructor(props) {
    super(props);
    this.state ={
      userInfo:new UserInfoDomain(),
    }
    this.userService =new UserService();
    this.showUserInfo = this.showUserInfo.bind(this);
    this.callBackQueryList = this.callBackQueryList.bind(this);
    this.giftNum = this.giftNum.bind(this);

  }
  userService:UserService;
  state ={
    userInfo:new UserInfoDomain(),
  }

  componentWillMount(){
    let username = sessionStorage.getItem("username");
    let loginToken = sessionStorage.getItem("loginToken");
    this.userService.queryUserInfo(username,loginToken,this.showUserInfo);
    let data ={
      username:username
    };
    this.userService.queryUserOrder(data,loginToken,this.callBackQueryList);

  }

  callBackQueryList(order,isSuccess){
    if(isSuccess){
      this.setState({orderGift: order.data});
    }
  }

  giftNum(){
    let orderGift =this.state==null?undefined: this.state["orderGift"];
    if(orderGift == undefined){
      return 0;
    }else{
      let count = 0;
      orderGift.dataList.forEach(value=>{
        count += value.quantity;
      });
      return count;
    }
  }

  showUserInfo(res, isSuccess){
    if(isSuccess && res.code =='200'){
      this.setState({userInfo:res.data});
    }else {
      message.info(res.message);
    }
  }

  render(){
    const {userInfo} = this.state;
    return (
      <div className={styles.user_body}>
        <div className={styles.body_header}>
          <div className={styles.header_user}>
            <div className={styles.user_avatar}>
            </div>
            <div className={styles.user_info}>
              <p className={styles.info_name}>{userInfo.umId}<span className={styles.name_title}></span></p>
              <p className="info_team">团队：{userInfo.userGroup}</p>
              <p className={styles.info_contribute}>
                <span className={styles.contribute_text}>累计积分：</span>
                <span className={styles.contribute_num}>{userInfo.historicalPoints}分</span>
              </p>
              <p className={styles.info_contribute}>
                <span className={styles.contribute_text}>可用积分：</span>
                <span className={styles.contribute_num}>{userInfo.currentPoints}分</span>
              </p>
              <p className="info_signature"></p>
              <a className={styles.info_modify} href="index.php/user/setting"></a>
            </div>
            {/*<a className={[styles["mod-btn"], styles["mod-btn-black"]].join(' ')} href="javascript:void(0)">我的公共主页</a>
            */}
            </div>
        </div>
        <div className={styles.body_content}>
          <ul className={styles.content_list}>
            <li className={[styles.list_item,styles["list_item-1"]].join(' ')}>
              <i className={styles.item_pic}></i>
              <div className={styles.item_content}>
                <p className={styles.content_title}>
                  <span className={styles.title_text}>我的积分</span>
                  <span className={styles.title_num}>{userInfo.currentPoints}</span>
                </p>
                <Link className={styles.content_detail} to={userPage.point}>积分明细 &gt;&gt;</Link>
              </div>
            </li>

            {/* <li className={[styles.list_item,styles["list_item-2"]].join(' ')}>
              <i className={styles.item_pic}></i>
              <div className={styles.item_content}>
                <p className={styles.content_title}>
                  <span className={styles.title_text}>我报告的漏洞</span>
                  <span className={styles.title_num}>0</span>
                  <span className={styles.title_text}>个</span>
                </p>
                <Link className={styles.content_detail} to={userPage.userLoophole}>报告漏洞的详情 &gt;&gt;</Link>
              </div>
            </li>*/}

            <li className={[styles.list_item,styles["list_item-3"]].join(' ')}>
              <i className={styles.item_pic}></i>
              <div className={styles.item_content}>
                <p className={styles.content_title}>
                  <span className={styles.title_text}>我所有的礼品</span>
                  <span className={styles.title_num}>{this.giftNum()}</span>
                  <span className={styles.title_text}>个</span>
                </p>
                <Link className={styles.content_detail} to={userPage.gift}>礼品详情 &gt;&gt;</Link>
              </div>
            </li>

            {/*<li className={[styles.list_item,styles["list_item-4"]].join(' ')}>
              <i className={styles.item_pic}></i>
              <div className={styles.item_content}>
                <p className={styles.content_title}>
                  <span className={styles.title_text}>我的新消息</span>
                  <span className={styles.title_num}>0</span>
                  <span className={styles.title_text}>条</span>
                </p>
                <Link className={styles.content_detail} to={userPage.message}>消息中心 &gt;&gt;</Link>
              </div>
            </li>*/}
          </ul>
        </div>
      </div>
    );
  }
}

export default UserBody
